/** @type {import('tailwindcss').Config} */
module.exports = {
  content: ['./index.html', './src/**/*.{vue,js,ts,jsx,tsx}'],
  theme: {
    extend: {
      colors: {
        primary: 'var(--el-color-primary)',
        success: 'var(--el-color-success)',
        warning: 'var(--el-color-warning)',
        danger: 'var(--el-color-danger)',
        info: 'var(--el-color-info)',
        'color-primary': 'var(--el-text-color-primary)',
        'color-regular': 'var(--el-text-color-regular)',
        'color-secondary': 'var(--el-text-color-secondary)',
        'color-placeholder': 'var(--el-text-color-placeholder)'
      },
      backgroundColor: theme => ({
        ...theme('colors'),
        primary: 'var(--el-color-primary)',
        success: 'var(--el-color-success)',
        warning: 'var(--el-color-warning)',
        danger: 'var(--el-color-danger)',
        info: 'var(--el-color-info)'
      }),
      borderColor: theme => ({
        ...theme('colors'),
        base: 'var(--el-border-color)',
        light: 'var(--el-border-color-light)',
        lighter: 'var(--el-border-color-lighter)',
        dark: 'var(--el-border-color-dark)',
        darker: 'var(--el-border-color-darker)',
        'extra-light': 'var(--el-border-color-extra-light)'
      })
    }
  },
  plugins: []
};
